<!--
 * @Description: 服务活动详情
 * @Autor: 何兴家
 * @Date: 2020-12-24 14:00:05
 * @LastEditors: 何兴家
 * @LastEditTime: 2020-12-28 09:21:33
-->
<template>
  <div>
    <FormPanel ref="formPanel" :labelWidth="110" :list="formList" :isSubmitBtn="false" formType="show"></FormPanel>
    <el-tabs v-model="activityinforTab" tab-position="left">
      <el-tab-pane label="活动内容" name="活动内容">
        <el-tabs v-model="activityRepairTab">
          <el-tab-pane label="维修项目" name="维修项目">
            <FilterTable
              ref="labourTable"
              :columns="labourColumns"
              height="auto"
              :isPagination="false"
              :isColumnFilter="false"
              :isToperInfo="false"
              :isSelectColumn="false"
              :onColumnsChange="columns => (this.labourColumns = columns)"
            >
            </FilterTable>
          </el-tab-pane>
          <el-tab-pane label="维修材料" name="维修材料">
            <FilterTable
              ref="partTable"
              :columns="partColumns"
              height="auto"
              :isPagination="false"
              :isColumnFilter="false"
              :isToperInfo="false"
              :isSelectColumn="false"
              :onColumnsChange="columns => (this.partColumns = columns)"
            >
            </FilterTable>
          </el-tab-pane>
        </el-tabs>
      </el-tab-pane>

      <el-tab-pane label="活动范围" name="活动范围">
        <el-tabs v-model="activeScopeTab">
          <el-tab-pane label="车型" name="车型">
            <FilterTable
              ref="modelTable"
              :columns="modelColumns"
              height="auto"
              :isPagination="false"
              :isColumnFilter="false"
              :isToperInfo="false"
              :isSelectColumn="false"
              :onColumnsChange="columns => (this.modelColumns = columns)"
            >
            </FilterTable>
          </el-tab-pane>
          <el-tab-pane label="VIN" name="VIN">
            <FilterTable
              ref="vinTable"
              :columns="vinColumns"
              height="auto"
              :isPagination="false"
              :isColumnFilter="false"
              :isToperInfo="false"
              :isSelectColumn="false"
              :onColumnsChange="columns => (this.vinColumns = columns)"
            >
            </FilterTable>
          </el-tab-pane>
        </el-tabs>
      </el-tab-pane>
    </el-tabs>

    <div class="dialogBottmView">
      <el-button>取消</el-button>
      <el-button type="primary">确定</el-button>
    </div>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { confirmAction, notifyAction, findFormItem, findTableItem } from '@/utils';

import { queryActivityDetailById } from '@/api/repair/repairReception/customer';

export default {
  props: ['viewRowData'],
  mixins: [dictionary],
  data() {
    return {
      formList: this.createFormList(),
      labourColumns: this.createLabourColumns(),
      partColumns: this.createPartColumns(),
      modelColumns: this.createModelColumns(),
      vinColumns: this.createVinColumns(),
      labourDataSource: [], // 项目数据源
      partDataSource: [], // 配件数据源
      modelDataSource: [], // 车型数据源
      vinDataSource: [], // vin数据源
      activityinforTab: '活动内容', // 激活的以及tab
      activityRepairTab: '维修项目', // 激活的维修类型tab
      activeScopeTab: '车型'
    };
  },
  mounted() {
    this.queryPageData();
  },
  methods: {
    createFormList() {
      return [
        {
          type: 'INPUT',
          label: '活动代码',
          fieldName: 'maNo'
        },
        {
          type: 'INPUT',
          label: '活动名称',
          fieldName: 'maTitle'
        },
        {
          type: 'INPUT',
          label: '活动总金额',
          fieldName: ''
        },
        {
          type: 'INPUT',
          label: '活动来源',
          fieldName: 'dataSource'
        },
        // {
        //   type: 'INPUT',
        //   label: '是否默认参与',
        //   fieldName: ''
        // },
        // {
        //   type: 'INPUT',
        //   label: '是否多次参加活动',
        //   fieldName: ''
        // },
        // {
        //   type: 'INPUT',
        //   label: '是否需要厂端审核',
        //   fieldName: ''
        // },
        {
          type: 'INPUT',
          label: '是否索赔结算',
          fieldName: 'ifSettle'
        },
        {
          type: 'INPUT',
          label: '活动日期',
          fieldName: 'bDate|eDate'
        }
        // {
        //   type: 'INPUT',
        //   label: '销售日期',
        //   fieldName: ''
        // }
      ];
    },
    createLabourColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.$index + 1}</span>;
          }
        },
        {
          title: '项目代码',
          dataIndex: 'labourCode'
        },
        {
          title: '项目名称',
          dataIndex: 'labourName'
        },
        {
          title: '派工工时',
          dataIndex: 'assignLabourHour'
        },
        {
          title: '收费工时',
          dataIndex: 'stdLabourHour'
        }
      ];
    },
    createPartColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.$index + 1}</span>;
          }
        }
      ];
    },
    createModelColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.$index + 1}</span>;
          }
        }
      ];
    },
    createVinColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.$index + 1}</span>;
          }
        }
      ];
    },

    // 查询页面数据
    async queryPageData() {
      try {
        let res = await queryActivityDetailById({ maId: this.viewRowData.MA_ID });
        if (res.resultCode == 200) {
          // 手动处理部分数据
          res.data.ttRpMaLabours.forEach(item => {
            item.assignLabourHour = item.stdLabourHour;
          });

          // 赋值
          this.formList.forEach(item => {
            item.initialValue = res.data[item.fieldName];
          });
          this.labourDataSource = res.data.ttRpMaLabours;
          this.partDataSource = res.data.ttRpMaParts;
          this.modelDataSource = res.data.ttRpMaLabours;
          this.vinDataSource = res.data.ttRpMaAreas;
        }
      } catch (err) {
        console.log(err, '获取活动详情失败');
      } finally {
      }
    }
  }
};
</script>

<style scoped></style>
